<template>
	<div class="maskCenter" v-show="show">
		<div>
			<div class="svgdiv">
				<Lottie :options="defaultOptions"/>
			</div>					
			<div class="spandiv">loading...</div>
		</div>
		
	</div>
</template>

<script>
	import * as animationData from '@/system/components/loading/data.json'
	import Lottie from 'vue-lottie/src/lottie.vue'
	export default{
		name: "loading",
		props:{
			show:{
				default:true
			}
		},
		components: {
	        Lottie
	    },
	    data() {
	        return {
	            defaultOptions: {
	                animationData: animationData.default
	            }
	        }
	    }

	}
</script>

<style>		
	.svgdiv{
		height: 300px;
		width: 400px;		
	}
	.spandiv{
		text-align: center;
		margin-top: -100px;
		letter-spacing:2px
	}
</style>